<template>
	<view class="address-list-container">
		<!-- 地址列表 -->
		<view class="address-list" v-if="addressList.length > 0">
			<view class="address-item" v-for="(item, index) in addressList" :key="item.id">
				<view class="address-info" @click="selectAddress(item.id)">
					<view class="name-phone">
						<text class="name">{{item.receive_name}}</text>
						<text class="phone">{{item.receive_phone}}</text>
					</view>
					<view class="address-detail">
						<text>{{item.area || item.region_name}} {{item.address}}</text>
					</view>
					<view class="default-tag" v-if="item.is_default === 1">默认地址</view>
				</view>
				<view class="address-actions">
					<view class="default-btn" :class="item.is_default === 1 ? 'active' : ''"
						@click="setDefault(item.id)" v-if="item.is_default === 0">
						<text>设为默认</text>
					</view>
					<view class="edit-btn" @click="editAddress(item.id)">
						<text>编辑</text>
					</view>
					<view class="delete-btn" @click="deleteAddress(item.id, index)">
						<text>删除</text>
					</view>
				</view>
			</view>
		</view>

		<!-- 空状态 -->
		<view class="empty-state" v-else>
			<image src="../../static/androidImg/icon_not_data.png" mode="widthFix" class="empty-icon"></image>
			<text class="empty-text">暂无收货地址</text>
		</view>

		<!-- 新增地址按钮 -->
		<view class="add-address-btn" @click="addAddress">新增收货地址</view>
	</view>
</template>

<script>
	import api from '../../api/request';

	export default {
		data() {
			return {
				addressList: [],
				page: 1
			};
		},
		onShow() {
			this.getAddressList();
		},
		methods: {
			// 选择地址
			selectAddress(id) {
				// 使用事件总线传递选中的地址ID
				uni.$emit('selectAddress', id);
				// 返回上一页
				uni.navigateBack();
			},
			// 返回上一页
			navigateBack() {
				uni.navigateBack();
			},

			// 获取地址列表
			getAddressList() {
				uni.showLoading({
					title: '加载中'
				});
				api.getAddressList({
					page: this.page
				}).then(res => {
					uni.hideLoading();
					if (res.code === 1 && res.data && res.data.rows) {
						this.addressList = res.data.rows;
					}
				}).catch(err => {
					uni.hideLoading();
					console.error('获取地址列表失败', err);
					uni.showToast({
						title: err.msg || '获取地址列表失败',
						icon: 'none'
					});
				});
			},

			// 新增地址
			addAddress() {
				uni.navigateTo({
					url: '/pages/address/address'
				});
			},

			// 编辑地址
			editAddress(id) {
				uni.navigateTo({
					url: `/pages/address/address?id=${id}`
				});
			},

			// 删除地址
			deleteAddress(id, index) {
				uni.showModal({
					title: '提示',
					content: '确定要删除这个地址吗？',
					success: (res) => {
						if (res.confirm) {
							uni.showLoading({
								title: '处理中'
							});
							api.deleteAddress({
								address_id: id
							}).then(res => {
								uni.hideLoading();
								if (res.code === 1) {
									this.addressList.splice(index, 1);
									uni.showToast({
										title: '删除成功'
									});
								} else {
									uni.showToast({
										title: res.msg || '删除失败',
										icon: 'none'
									});
								}
							}).catch(err => {
								uni.hideLoading();
								console.error('删除地址失败', err);
								uni.showToast({
									title: err.msg || '删除地址失败',
									icon: 'none'
								});
							});
						}
					}
				});
			},

			// 设置默认地址
			setDefault(id) {
				uni.showLoading({
					title: '处理中'
				});
				api.setDefaultAddress({
					id: id
				}).then(res => {
					uni.hideLoading();
					if (res.code === 1) {
						// 更新列表中的默认地址状态
						this.addressList.forEach(item => {
							item.is_default = item.id === id ? 1 : 0;
						});
						uni.showToast({
							title: '设置成功'
						});
					} else {
						uni.showToast({
							title: res.msg || '设置失败',
							icon: 'none'
						});
					}
				}).catch(err => {
					uni.hideLoading();
					console.error('设置默认地址失败', err);
					uni.showToast({
						title: err.msg || '设置默认地址失败',
						icon: 'none'
					});
				});
			}
		}
	};
</script>

<style scoped lang="scss">
	.address-list-container {
		padding-bottom: 120rpx;
	}

	/* 地址列表样式 */
	.address-list {
		padding: 0 30rpx;
	}

	.address-item {
		background-color: #fff;
		// border-radius: 16rpx;
		padding: 30rpx;
		margin-bottom: 20rpx;
		position: relative;
		border-bottom: 1rpx solid #d6d7dc;

	}

	.address-info {
		margin-bottom: 20rpx;
	}

	.name-phone {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 15rpx;
	}

	.name {
		font-size: 32rpx;
		color: #333;
		font-weight: bold;
	}

	.phone {
		font-size: 28rpx;
		color: #666;
	}

	.address-detail {
		font-size: 28rpx;
		color: #666;
		line-height: 1.5;
		margin-bottom: 15rpx;
	}

	.default-tag {
		display: inline-block;
		background-color: #e64340;
		color: #fff;
		font-size: 24rpx;
		padding: 5rpx 15rpx;
		border-radius: 15rpx;
	}

	.address-actions {
		display: flex;
		justify-content: flex-end;
		gap: 30rpx;
	}

	.default-btn,
	.edit-btn,
	.delete-btn {
		font-size: 28rpx;
		color: #666;
	}

	.default-btn.active {
		color: #e64340;
	}

	.delete-btn {
		color: #ff4d4f;
	}

	/* 空状态样式 */
	.empty-state {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		height: 600rpx;
	}

	.empty-icon {
		width: 200rpx;
		height: 200rpx;
		margin-bottom: 30rpx;
	}

	.empty-text {
		font-size: 30rpx;
		color: #999;
	}

	/* 新增地址按钮 */
	.add-address-btn {
		position: fixed;
		bottom: 30rpx;
		left: 50%;
		transform: translateX(-50%);
		width: 690rpx;
		height: 90rpx;
		background-color: #e64340;
		color: #fff;
		font-size: 32rpx;
		text-align: center;
		line-height: 90rpx;
		border-radius: 45rpx;
	}
</style>